import React, { CSSProperties } from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { library, SizeProp, IconProp } from '@fortawesome/fontawesome-svg-core';
import { fas } from '@fortawesome/free-solid-svg-icons';
// 将图标库中所有图标加入
library.add(fas);

export interface IconBaseProps {
  /** 图标的名称 */
  name: IconProp;
  /** 图标大小 */
  size?: SizeProp;
  /** 图标的样式 */
  style?: CSSProperties;
  /** 图标的样式名称 */
  className?: string;
  /** 图标的颜色 */
  color?: string;
}

const Icon: React.FC<IconBaseProps> = (props) => {
  const { name, size = '1x', ...otherProps } = props;

  return (
    <FontAwesomeIcon icon={name} size={size} {...otherProps}></FontAwesomeIcon>
  );
};

export default Icon;
